<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>分类</title>
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
<header>
    <div class="left">猫咪V</div>
    <div class="middle">
        <div class="search"></div>
        <div class="text">请输入搜索内容</div>
    </div>
    <div class="right"></div>
</header>


<div class="nav">
    <div class="left">
        <div class="text-left">分类</div>
    </div>
    <div class="right-wrapper">
    <div class="right">
        <div class="text-right">品牌</div>
    </div>
    </div>
</div>

<main>
    <div class="pet-left">
        <a href="javascript:void(0)" class="back">为你推荐</a>
        <a href="javascript:void(0)">为你推荐</a>
        <a href="javascript:void(0)">为你推荐</a>
        <a href="javascript:void(0)">为你推荐</a>
        <a href="javascript:void(0)">为你推荐</a>
        <a href="javascript:void(0)">为你推荐</a>
        <a href="javascript:void(0)">为你推荐</a>
        <a href="javascript:void(0)">为你推荐</a>
        <a href="javascript:void(0)">为你推荐</a>
    </div>
    <div class="pet-right">
        <div class="banner">
            <div class="text-4">热门分类</div> </div>

        <div class="per-wrapper">
        <div class="content ">
            <div class="img-5"></div>
            <div class="text-5">进口猫粮</div>
        </div>
        <div class="content ">
            <div class="img-5"></div>
            <div class="text-5">进口猫粮</div>
        </div>
        <div class="content  ">
            <div class="img-5"></div>
            <div class="text-5">进口猫粮</div>
        </div>
        <div class="content ">
            <div class="img-5"></div>
            <div class="text-5">进口猫粮</div>
        </div>
        <div class="content ">
            <div class="img-5"></div>
            <div class="text-5">进口猫粮</div>
        </div>
        <div class="content ">
            <div class="img-5"></div>
            <div class="text-5">进口猫粮</div>
        </div>
        </div>
    </div>
</main>

<footer>
    <div class="content-2">
        <a href= "../home-page/index.html" class="img-2">
        </a>
        <a href= "../home-page/index.html" class="text-3">精选</a>
    </div>
    <div class="content-2">
        <a href="../classification/index.html" class="img-2">
        </a>
        <a href="../classification/index.html" class="text-3">分类</a>
    </div>
    <div class="content-2">
        <a href="../community/index.html" class="img-2">
        </a>
        <a  href="../community/index.html" class="text-3">社区</a>
    </div>
    <div class="content-2 margin-right">
        <a href="../mine/index.html" class="img-2">
        </a>
        <a href="../mine/index.html" class="text-3">我的</a>
    </div>
</footer>


<script>
  /*  (function(){
        resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
            recalc = function (){
                var cWidth = document.documentElement.clientWidth
                    || document.body.clientWidth;
                if (!cWidth) return;
                document.documentElement.style.fontSize = 100 * (cWidth / 750) + 'px';
            };
        if (!document.addEventListener) return;
        window.addEventListener(resizeEvt, recalc, false);
        document.addEventListener('DOMContentLoaded', recalc, false);
    })();*/
</script>

</body>
</html>